/**
 * Dashboard Page Class.
 */

function TabState(tabUlStr){
	this.$tabUl = $(tabUlStr);
	this.$tabs = this.$tabUl.find("li a");
}

TabState.prototype = {
	
	/**
	 * make the index's tab hightlighted
	 * @param {Object} currentIndex -1 means no tab is highlighted
	 */
	changeCurrent : function(currentIndex){
		
		var $beforeCurrent = this.$tabs.filter(".tabCurrent");
		$beforeCurrent.removeClass("tabCurrent");
		$beforeCurrent.css("background-position", "");
		if(currentIndex == -1){
			// index == -1 means no tab is highlighted
			return ;
		}
		var $currentItem = this.$tabs.eq(currentIndex);
		$currentItem.addClass("tabCurrent");
		$currentItem.css("background-position" ,""+ (-74)*currentIndex+"px -80px");
	}
}


function TrackedTags(ulSel){
	this.$ul = $(ulSel);
}

TrackedTags.prototype = {
	init : function(){
		var _this = this;
		var $as = this.$ul.find("li a:first-child");
		$as.each(function(){
			$(this).siblings(".tagRemove").click(function(){
				var $temp = $(this).parent().fadeOut(700).queue(function(){$temp.remove();});
				
				// ajax to remove tag in db
				$.get($(this).attr("href"));
				return false;
			});
			$(this).siblings(".tagTrack").click(function(){
				$(this).siblings(".tagRemove").show();
				$(this).hide();
				$.get($(this).attr("href"));

				return false;
			});
		});
		
		$as.click(function(){
			var tabState = new TabState("#tab");
			tabState.changeCurrent(4);
			var infoBar = new SideBarBox("#sideBarOuter .current.first");
			infoBar.changeCurrent(-1);
			_this.clearCurrent();
			var tagName =  $(this).text();
			_this.changeIndex($(this).parent().index());
			
			// load info by ajax
			$("#thread").empty().load($(this).attr("href"), function(){		
				var notes = new Note(".noteOuter",".note-btn");
			});

			return false;
		});
	},
	
	changeIndex : function(index){
		var $lis = this.$ul.children("li");
		$lis.filter(".current").removeClass("current");
		$lis.eq(index).addClass("current");
		$lis.eq(index).children(".tagRemove").show();
	},
	
	addNewTag : function(tagName){
		var $li = $("<li></li>");
		var $a = $("<a class='tag'></a>");
		$a.text(tagName);
		$a.attr("href", "/dorimeme/tags/search/"+tagName);
		
		var $x = $("<a class='tagRemove' href='#'>x</a>");
		$x.css("display", "none");
		var $track = $("<a class='tagTrack' href='#'>Track</a>");
		$track.css("display", "block");
		$li.append($a);
		$li.append($x);
		$li.append($track);
		$li.addClass("current");
		this.$ul.append($li);
	},
	
	/**
	 * return whether there is a tag already
	 * @param {Object} tagName
	 */
	check : function(tagName){
		var $as = this.$ul.find("li a:first-child");
		for(var i = 0; i < $as.size(); i++){
			if($as.eq(i).text() == tagName){
				// highlight it and return false;
				this.changeIndex(i);
				return true;
			}
		}
		return false;
	},
	
	clearCurrent : function(){
		var $lis = this.$ul.children("li");
		var $before = $lis.filter(".current");
		if ($before.children(".tagTrack").css("display") == "block") {
			$before.remove();
			return;
		}
		else {
			$before.children(":gt(0)").css("display", "none").end().removeClass("current");
		}
	}
}
/**
 * used for info side bar
 * @param {Object} ulSel
 */
function SideBarBox(ulSel){
	this.$boxUl = $(ulSel);
	this.$items = this.$boxUl.find("a");
	
}

SideBarBox.prototype = {
	changeCurrent : function(currentIndex){
		this.$items.parent(".current").removeClass("current");
		
		var $currentLi = $(this.$items).parent().filter(":eq("+ currentIndex+")");
		$currentLi.addClass("current");
	}
}



function NavState(navStr){
	this.$navUl = $(navStr);
	this.$navs = this.$navUl.find("li");
}

NavState.prototype = {
		
	/**
	 * make the index's nav highlighted
	 * @param {Object} currentIndex -1 means no nav is highlighted
	 */
	changeCurrent : function(currentIndex){
		var $beforeCurrent = this.$navs.filter(".current");
		$beforeCurrent.removeClass("current");
		
		if(currentIndex == -1){
			return ;
		}
		var $currentItem = this.$navs.eq(currentIndex);
		$currentItem.addClass("current");
	}
}

function SubMenu(btnSel,subMenuSel){
	_this = this;
	this.$btn = $(btnSel);
	this.$submenu = $(subMenuSel);
	this.$btn.click(function(){
		_this.$submenu.slideToggle();
		$(this).blur(function(){
			_this.$submenu.slideUp();
		});
		return false;
	});
}

function TabSubmenu(btnSel, submenuSel){
	this.$btn = $(btnSel);
	this.$submenu = $(submenuSel);
	this.showing = false;
	this.init();
}

TabSubmenu.prototype = {
	
	init : function(){
		var _this = this;
		this.$btn.click(function(){
			if (_this.showing) {
				_this.$submenu.fadeOut();
				_this.showing = false;
			}else{
				_this.$submenu.fadeIn();
				_this.showing = true;
			}
			return false;
		});
	}
	
}

function FollowAndUnfollow(fSel, unfSel){
	this.$follow = $(fSel);
	this.$unfollow = $(unfSel);
	this.init(); 
}

FollowAndUnfollow.prototype = {
	init : function(){
		this.$follow.click(function(){
			var thisBtn = this;
			var url = $(this).attr("href");
			$.get(url, function(data){
				if (true) {
					$(thisBtn).hide();
					$(thisBtn).siblings(".unfollow").show();
				}
			});
			return false;
		});
		this.$unfollow.click(function(){
			var thisBtn = this;
			var url = $(this).attr("href");
			$.get(url, function(data){
				if (true) {
					$(thisBtn).hide();
					$(thisBtn).siblings(".follow").show();
				}
			});
			return false;
		});
	}
}

/**
 * SerchForm 
 * Used to send and recive search word and results.
 * Use AJAX to show the results on the dashboard.
 * @access public
 * */
function SearchForm($formId){
	var _this = this;
	this.form = $($formId);
	this.form.find('label').hide();
	this.keyword = this.form.find('#PostsKeyword');
	//clear the value of search input
	this.keyword.click(function(){
		if(!$(this).val() || $(this).val() == 'Search'){		
			$(this).val('');
			$(this).css('opacity','1.0');
		}	
	});
	//reset the value of search input
	this.keyword.blur(function(){
		if(!$(this).val()){
			$(this).val('Search');
			$(this).css('opacity','0.7');
		}
	});
	
	this.form.submit(function(){
		
		// tab index changes
		var tabState = new TabState("#tab");
		tabState.changeCurrent(4);
		
		// side bar index =-1
		var infoBox = new SideBarBox("#sideBarContent .box.first");
		infoBox.changeCurrent(-1);
		
		// search the tracked tags and see whether there is already one
		var keywordText = _this.keyword.val();
		var tagsContainer = new TrackedTags("#trackTags .boxContent");
		tagsContainer.init();
		
		// remove the before current
		tagsContainer.clearCurrent();

		if (!tagsContainer.check(keywordText)) {
			// no tracked tag matched by searched keyword
			// insert new li into tags queue
			// in the first iteration, we insert it into the second place
			// but after this, we will sort the queue by dictionary
			tagsContainer.addNewTag(keywordText);
			tagsContainer.init();
		}
		//load info
		$("#thread").empty().load("/dorimeme/tags/search/" + keywordText, function(){
			var note = new Note(".noteOuter",".note-btn");
		});
		
		
		return false;
	});
}
SearchForm.prototype = {
	
}
$(document).ready(function(){
	var searchForm = new SearchForm('#PostsSearchForm');
	var subMenu = new SubMenu("#nav li:eq(1)", "#header .wrap .submenu");
	var tabSubmenu = new TabSubmenu("#tab li:eq(3)", "#tabSubMenu");

	var trackedTags = new TrackedTags("#trackTags .boxContent");
	trackedTags.init();
	var fAndUf = new FollowAndUnfollow("#following .follow", "#following .unfollow");
});